﻿//文档就绪函数
$(function () {
    //初始化表格
    ShowReporting();
});


//工序任务列表展示
function ShowReporting() {
    layui.use(function () {

        // 点击导出按钮
        document.getElementById('exportBtn').addEventListener('click', function () {
            var checkStatus = table.checkStatus('ReportingTable');  // 获取当前表格的选中状态
            var selectedData = checkStatus.data;  // 获取选中的数据
            if (selectedData.length === 0) {
                alert('请先选择要导出的数据!');
                return;
            }
            var filteredData = selectedData.map(function (item) {
                // 创建一个新对象，只包含您想要的属性
                return {
                    '报工任务Id': item.reportingId,
                    '报工编号': item.reportingNumber,
                    '任务编号': item.taskNumber,
                    '工序名称': item.processName,
                    '生产批次': item.productionBatch,
                    '报工数量': item.reportingNum,
                    '成品编号': item.processName,
                    '成品名称': item.productNumber,
                    '设备名称': item.equipmentName,
                    '工单编号': item.productNumber,
                    '操作人': item.operator,
                    '报工时间': item.createdDate,
                };
            });

            // 使用 XLSX 导出选中的数据
            var wb = XLSX.utils.book_new();
            var ws = XLSX.utils.json_to_sheet(filteredData); // 将选中的数据转换为工作表
            XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');

            // 导出为 Excel 文件
            XLSX.writeFile(wb, '报工记录列表.xlsx');
        });

        var table = layui.table;
        var ReportingNumber = $("#ReportingNumber").val();
        var TaskNumber = $("#TaskNumber").val();

        //执行渲染
        table.render({
            elem: '#ReportingTable',
            page: {
                limit: 15, //每页显示的条数
                limits: [15, 20, 25, 30] //每页显示条数的选择项
            },
            cols: [[
                { type: 'checkbox', fixed: 'left' },
                { field: 'reportingNumber', title: '报工编号', width: 200 },
                { field: 'taskNumber', title: '任务编号', width: 130 },
                { field: 'processName', title: '工序名称', width: 130 },
                { field: 'productionBatch', title: '生产批次', width: 130 },
                { field: 'reportingNum', title: '报工数量', width: 130 },
                { field: 'taskNumber', title: '成品编号', width: 130 },
                { field: 'processName', title: '成品名称', width: 130 },
                { field: 'equipmentName', title: '设备名称', width: 130 },
                { field: 'productNumber', title: '工单编号', width: 130 },
                { field: 'operator', title: '操作人', width: 130 },
                { field: 'createdDate', title: '报工时间', width: 160 },
                {
                    field: '', title: '操作', width: 180, templet: function (d) {
                        return '<a class="layui-btn layui-bg-blue layui-btn-xs" href="javascript:;" onclick="CheckInfo(' + d.reportingId + ')">详情</a>'
                    }
                }
            ]],
            //数据接口
            data: []
        });
        //请求数据
        $.ajax({
            url: '../ProcessTasks/GetReportingList',
            type: "get",
            headers: {
                "Authorization": localStorage.getItem("token")
            },
            data: {
                PageIndex: 1,
                PageSize: 15,
                ReportingNumber: ReportingNumber,
                TaskNumber: TaskNumber
            },
            success: function (data) {
                data = JSON.parse(data);
                //console.log(data);
                table.reload('ReportingTable', {
                    pagge: {
                        limit: 15,
                        limits: [15, 20, 25, 30]
                    },
                    data: data.data.list
                });
            },
            error: function () {
                console.log("请求失败");
            }

        });
    });
}


//查看
layui.use(['table', 'form', 'layer'], function () {
    var table = layui.table;
    var form = layui.form;
    var layer = layui.layer;
    //查看工人信息
    window.CheckInfo = function (reportingId) {
        var token = localStorage.getItem("token");
        //先根据id获取数据
        $.ajax({
            type: "Get",
            headers: {
                "Authorization": token
            },
            url: "../ProcessTasks/ReverseReporting",
            data: { ReportingId: reportingId },
            success: function (res) {
                var data = JSON.parse(res).data;
                console.log(data);
                $("#ReportingNumberFan").val(data.reportingNumber);
                $("#TaskNumberFan").val(data.taskNumber);
                $("#ProcessName").val(data.processName);
                $("#ProductionBatch").val(data.productionBatch);
                $("#ReportingNum").val(data.reportingNum);
                $("#EquipmentName").val(data.equipmentName);
                $("#ProductNumber").val(data.productNumber);
                $("#Operator").val(data.operator);
                $("#createdDate").val(data.createdDate);
                $("#ProcessNameTwo").val(data.processName);
                $("#ProductNumberTwo").val(data.productNumber);
            }
        });
        layer.open({
            type: 1,//iframe层
            title: '报工详情信息',
            shadeClose: true,  // 点击遮罩区域，关闭弹层
            shade: 0.8,//遮罩透明度
            area: ['600px', '500px'],//弹层大小
            anim: 0, // 0-6 的动画形式，-1 不开启
            content: `<form class="layui-form" action="">
                <div class="layui-form-item">
                    <label class="layui-form-label">报工编号</label>
                    <div class="layui-input-inline">
                        <input type="text" id="ReportingNumberFan" name="ReportingNumberFan" required lay-verify="required" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">任务编号</label>
                    <div class="layui-input-inline">
                        <input type="text" id="TaskNumberFan" name="TaskNumberFan" required lay-verify="required" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">工序名称</label>
                    <div class="layui-input-inline">
                        <input type="text" id="ProcessName" name="ProcessName" required lay-verify="required" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">生产批次</label>
                    <div class="layui-input-inline">
                        <input type="text" id="ProductionBatch" name="ProductionBatch" required lay-verify="required" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">报工数量</label>
                    <div class="layui-input-inline">
                        <input type="text" id="ReportingNum" name="ReportingNum" required lay-verify="required" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">成品编号</label>
                    <div class="layui-input-inline">
                        <input type="text" id="ProductNumber" name="ProductNumber" required lay-verify="required" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">产品名称</label>
                    <div class="layui-input-block">
                        <input type="text" id="ProcessNameTwo" name="ProcessNameTwo" required lay-verify="required" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">设备名称</label>
                    <div class="layui-input-block">
                        <input type="text" id="EquipmentName" name="EquipmentName" required lay-verify="required|phone" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">工单编号</label>
                    <div class="layui-input-block">
                        <input type="text" id="ProductNumberTwo" name="ProductNumberTwo" required lay-verify="required|phone" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">操作人</label>
                    <div class="layui-input-block">
                        <input type="text" id="Operator" name="Operator" required lay-verify="required|phone" disabled autocomplete="off" style="width:300px" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">报工时间</label>
                    <div class="layui-input-block">      
                       <input type="text" class="layui-input" id="createdDate" placeholder="yyyy-MM-dd HH:mm:ss" disabled>
                    </div>
                </div>          
            </form>`,
            success: function () {
                // 确保DOM元素已完全加载后渲染表单
                setTimeout(function () {
                    form.render();
                }, 300); // 使用 setTimeout 延迟渲染，确保DOM完全加载
            }
        });
    }
});
